Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(form): add support for disabling various array input capabilities #7615

Draft
wants to merge 1 commit into
base: next
Choose a base branch
from

Conversation

bjoerge
Copy link
Member

@bjoerge bjoerge commented Oct 14, 2024

Note: Opening this as a draft PR to get early feeback. Once we agree on the general direction, I'll continue with these remaining todos:

  • Implement for primitive arrays
  • Implement for Grid Array Inputs
  • Add tests (either e2e or unit tests if applicable)

Description

This adds support for the disableActions option on array fields for disabling various array input capabilities like:

  • add – Removes the ability to add new items to the array
  • addBefore – Removes the "Add item before"-menu item from the array item menu
  • addAfter – Removes the "Add item after"-menu item from the array item menu
  • remove – Removes the ability to remove items from the array
  • duplicate – Removes the ability to duplicate array items
  • copy – Removes the ability to copy items from the array

Usage example:

{
      name: 'someArrayField',
      options: {
        disableActions: ['add', 'duplicate'],
      },
      title: "Array you can't add elements to",
      type: 'array',
      of: [
        {
          type: 'object',
          name: 'something',
          title: 'Something',
          fields: [{name: 'first', type: 'string', title: 'First string'}],
        },
      ],
    }

Things to note:

  • These changes are only about UI affordances, and doesn't imply any form of write protection for the actual data
  • This only applies to arrays of objects and arrays of primitive values, and not to portable text arrays.
  • Disabling add will also implicitly disable addBefore and addAfter, thus disable inserting new items to the array entirely (although items can still be inserted via duplicate).
  • There might not be a compelling use case for disabling the ability to copy here(?), but including it for completeness. If all known actions are disabled, the menu items and "add"-affordances will be removed from the UI.
  • If we later decide to introduce a new default action, this will appear after upgrading the Studio, and will have to be explicitly disabled.

What to review

Does the feature make sense? Could the API be less confusing?

Testing

Notes for release

  • Adds support for the disableActions option on array fields for disabling various array input capabilities

Note: please include the relevant parts from the description of the feature above in the release notes.

Copy link

vercel bot commented Oct 14, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
page-building-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 3:17pm
performance-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 3:17pm
test-compiled-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 3:17pm
test-next-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 3:17pm
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 3:17pm
1 Skipped Deployment
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Visit Preview Oct 16, 2024 3:17pm

@bjoerge bjoerge requested review from mmgj and EoinFalconer October 14, 2024 14:53
Copy link
Contributor

No changes to documentation

Copy link
Contributor

github-actions bot commented Oct 14, 2024

Component Testing Report Updated Oct 16, 2024 3:14 PM (UTC)

✅ All Tests Passed -- expand for details
File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 46s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 8s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ✅ Passed (Inspect) 32s 6 0 0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx ✅ Passed (Inspect) 38s 11 7 0
formBuilder/inputs/PortableText/copyPaste/CopyPasteFields.spec.tsx ✅ Passed (Inspect) 0s 0 12 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 18s 6 0 0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx ✅ Passed (Inspect) 10s 3 0 0
formBuilder/inputs/PortableText/DragAndDrop.spec.tsx ✅ Passed (Inspect) 3m 0s 0 0 0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 46s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 1m 40s 21 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 1m 16s 18 0 0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx ✅ Passed (Inspect) 9s 3 9 0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx ✅ Passed (Inspect) 26s 9 0 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 18s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 36s 12 0 0
formBuilder/tree-editing/TreeEditing.spec.tsx ✅ Passed (Inspect) 0s 0 3 0
formBuilder/tree-editing/TreeEditingNestedObjects.spec.tsx ✅ Passed (Inspect) 0s 0 3 0

Copy link
Contributor

github-actions bot commented Oct 14, 2024

⚡️ Editor Performance Report

Updated Wed, 16 Oct 2024 15:17:58 GMT

Benchmark reference
latency of sanity@latest
experiment
latency of this branch
Δ (%)
latency difference
article (title) 14.4 efps (70ms) 14.7 efps (68ms) -2ms (-2.2%)
article (body) 49.6 efps (20ms) 53.5 efps (19ms) -1ms (-7.2%)
article (string inside object) 15.9 efps (63ms) 17.1 efps (59ms) -5ms (-7.1%)
article (string inside array) 13.0 efps (77ms) 13.5 efps (74ms) -3ms (-3.9%)
recipe (name) 30.3 efps (33ms) 29.4 efps (34ms) +1ms (+3.0%)
recipe (description) 32.3 efps (31ms) 34.5 efps (29ms) -2ms (-6.5%)
recipe (instructions) 99.9+ efps (7ms) 99.9+ efps (7ms) +0ms (-/-%)
synthetic (title) 14.7 efps (68ms) 15.2 efps (66ms) -2ms (-2.9%)
synthetic (string inside object) 15.4 efps (65ms) 15.3 efps (66ms) +1ms (+0.8%)

efps — editor "frames per second". The number of updates assumed to be possible within a second.

Derived from input latency. efps = 1000 / input_latency

Detailed information

🏠 Reference result

The performance result of sanity@latest

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 70ms 78ms 95ms 439ms 1031ms 15.4s
article (body) 20ms 22ms 45ms 164ms 346ms 6.9s
article (string inside object) 63ms 65ms 73ms 254ms 483ms 9.4s
article (string inside array) 77ms 80ms 90ms 217ms 1257ms 10.6s
recipe (name) 33ms 36ms 42ms 79ms 1ms 9.0s
recipe (description) 31ms 32ms 40ms 114ms 0ms 6.2s
recipe (instructions) 7ms 9ms 10ms 43ms 0ms 3.4s
synthetic (title) 68ms 77ms 94ms 376ms 1624ms 16.0s
synthetic (string inside object) 65ms 68ms 85ms 639ms 1837ms 10.7s

🧪 Experiment result

The performance result of this branch

Benchmark latency p75 p90 p99 blocking time test duration
article (title) 68ms 73ms 135ms 227ms 529ms 14.1s
article (body) 19ms 22ms 65ms 189ms 232ms 6.4s
article (string inside object) 59ms 61ms 66ms 143ms 413ms 9.2s
article (string inside array) 74ms 77ms 83ms 215ms 1128ms 10.0s
recipe (name) 34ms 36ms 55ms 80ms 0ms 9.0s
recipe (description) 29ms 32ms 36ms 77ms 0ms 6.2s
recipe (instructions) 7ms 8ms 9ms 20ms 0ms 3.4s
synthetic (title) 66ms 68ms 76ms 139ms 837ms 14.2s
synthetic (string inside object) 66ms 73ms 83ms 484ms 1830ms 9.9s

📚 Glossary

column definitions

  • benchmark — the name of the test, e.g. "article", followed by the label of the field being measured, e.g. "(title)".
  • latency — the time between when a key was pressed and when it was rendered. derived from a set of samples. the median (p50) is shown to show the most common latency.
  • p75 — the 75th percentile of the input latency in the test run. 75% of the sampled inputs in this benchmark were processed faster than this value. this provides insight into the upper range of typical performance.
  • p90 — the 90th percentile of the input latency in the test run. 90% of the sampled inputs were faster than this. this metric helps identify slower interactions that occurred less frequently during the benchmark.
  • p99 — the 99th percentile of the input latency in the test run. only 1% of sampled inputs were slower than this. this represents the worst-case scenarios encountered during the benchmark, useful for identifying potential performance outliers.
  • blocking time — the total time during which the main thread was blocked, preventing user input and UI updates. this metric helps identify performance bottlenecks that may cause the interface to feel unresponsive.
  • test duration — how long the test run took to complete.

@bjoerge bjoerge requested review from markmichon, runeb and rexxars and removed request for mmgj October 15, 2024 08:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant